<template>
  <div :ref="getel">
    <slot name="default" :done="done" />
  </div>
</template>
<script setup>
import { onMounted, ref } from "vue";
var el = ref("");
function getel(v) {
  if (el.value !== v) {
    el.value = v;
  }
}
var done = ref(false);
onMounted(() => {
  var ob = new IntersectionObserver(
    (v) => {
      console.log(v[0]);
      done.value = v[0].isIntersecting;
    },
    {
      root: document,
      threshold: 0.1,
    }
  );
  ob.observe(el.value);
});
</script>